/*
 * @Author: zhicheng.yao 
 * @Date: 2021-10-19 18:00:17 
 * @Last Modified by: zhicheng.yao
 * @Last Modified time: 2021-10-25 10:01:57
 */
import React from 'react'
import './index.scss'

interface Props {
    btnTxt?: string
    isCancel?: boolean
    btnStyle?: React.CSSProperties
    isDelete?: boolean
    styleName?: string
    children?: React.ReactNode
    btnFunc?: Function
}

const ButtonBox = (props: Props) => {
    let btnFunction = (e: React.MouseEvent) => {
        props.btnFunc?.(e)
    }
    let { btnTxt, isCancel, btnStyle, isDelete, styleName, children } = props
    return (
        <div
            className={
                styleName
                    ? `ButtonBox confirm ${styleName}`
                    : isCancel
                    ? 'ButtonBox cancel'
                    : isDelete
                    ? 'ButtonBox delete'
                    : 'ButtonBox confirm'
            }
            onClick={btnFunction}
            style={btnStyle}
        >
            {styleName === 'downloadBtn' ? <em></em> : ''}
            {styleName === 'uploadBtn' ? <em></em> : ''}
            {children ? children : ''}
            {btnTxt}
        </div>
    )
}

export default ButtonBox
/**
 * <ButtonBox
 * btnTxt={cancelTxt} //按钮文本
 * btnStyle={{}} //按钮样式 默认108*36
 * isCancel={true} //是否是取消类型的按钮 true是 false不是
 * btnFunc={this.closeModal} //按钮触发函数
 * isDelete={true} //是否删除按钮
 * />
 */
